<template>
	<view class="content">
		<view class="zy-list-bank" v-for="(item,index) in bankcardList"   @click="selectBank(item)">
			<bank-item  :key="index" :bankCode="item.bankCode" :cardCode="item.bankcardNo" :bankName="item.bankName"></bank-item>
			<zywork-icon class="zy-remove" @click.stop="open(item.bankcardNo)" type="iconchahao" sizeRpx="40" color="#ffffff"></zywork-icon>
		</view>
		<view class="placeholder">
			
		</view>
		<button class="zy-add" @tap="goaddpay()">添加银行卡</button>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import * as ResponseStatus from '@/common/response-status.js';
	import { doGet, BASE_URL, doGetForm,doPostForm, getUserToken, doPostJson, USER_TOKEN_KEY, FRONT_BASE_URL, LOCAL_FILE_STORAGE,showInfoToast, showSuccessToast } from '@/common/util.js';
	import bankItem from '@/components/bank-item/bank-item.vue'
	import zyworkIcon from '@/components/zywork-icon/zywork-icon.vue'
	export default {
		components: {
			bankItem,
			uniPopup,
			zyworkIcon
		},
		data() {
			return {
				source: 0, // 来源，如果是1，则表示是从下单页面过来的
				pager: {
					pageNo: 1,
					pageSize: 10,
					sortColumn: '',
					sortOrder: '',
					isActive: null,
					
				},
				bankcardList: []
			};
		},
		onLoad(option) {
			if(option.source){
				this.source = option.source;
			}
		},
		onShow() {
			this.loadBankcardList()
		},
		methods:{
			//选择银行卡
			selectBank(item) {
				if (this.source == 1) {
					//this.$api.prePage()获取上一页实例，在App.vue定义
					this.$api.prePage().bankcard = item;
					this.$api.prePage().bankcardId = item.id;
					uni.navigateBack()
				}
			},
			open(id){
				uni.showModal({
				    title: '解绑',
				    content: '是否解绑你的银行卡',
					confirmText:"是",
					cancelText:"否",
				    success:res => {
				        if (res.confirm) {
				            this.deletePay(id);
				        } else if (res.cancel) {
				           
				        }
				    }
				});
			},
			goaddpay() {
			    uni.navigateTo({
			        url: 'addbank',
			    });
			},
			/**
			 * 加载银行卡列表
			 */
			loadBankcardList() {
				uni.showLoading({
					title: '加载中...'
				})
				doPostJson('/user-bankcard/user/all-cond',{}, {}, true).then(response => {
					uni.hideLoading()
					let [error, res] = response
					if (res.data.code == ResponseStatus.OK) {
						this.bankcardList = res.data.data.rows
					} else {
						showInfoToast(res.data.message)
					}
				})
			},
			/**
			 * 删除支付方式
			 * @param {Object} id
			 */
			deletePay(bankcardNo) {
				uni.showModal({
					title: '提示',
					content: '确定要解绑？',
					success: (e) => {
						if (e.confirm) {
							doPostForm('/user-bankcard/user/unbind', {bankcardNo:bankcardNo},{}, true).then(response => {
								let [error, res] = response
								if (res.data.code == ResponseStatus.OK) {
									this.loadBankcardList()
									showInfoToast(res.data.message)
								} else {
									showInfoToast(res.data.message)
								}
							})
						}
					}
					
				})
				
			},
		}
	}
</script>

<style lang="scss">
	.placeholder{
		width: 100%;
		height: 120rpx;
	}
	.zy-list-bank{
		padding: 0rpx 30rpx;
	}
	.zy-remove{
		position: absolute;
		z-index: 999;
		top: 2rpx;
		right: 32rpx;
	}
	.zy-add{
		position: fixed;
		z-index: 999;
		left:150rpx;
		bottom: 20rpx;
		width: 450rpx;
		height: 80rpx;
		line-height: 80rpx;
		background-color: #00aa7f;
		color: #FFFFFF;
		border-radius: 35rpx;
		text-align: center;
	}
	
</style>
